'use client'
import {Flex} from "antd";
import MenuBar from "@/app/components/home/menubar";
import FootBar from "@/app/components/footbar";
import React, { } from "react";

const menuBarStyle:React.CSSProperties = {
  width:'16%',
  overflowY:"auto",
  height:'88vh',
  marginTop:'2vh',
  backgroundColor:'#fafafa',
  borderTop:'2px solid #fafafa'
}
const contentStyle:React.CSSProperties = {
  width:'84%',
  overflowY:"auto",
  height:'88vh',
    marginTop:'2vh',
    marginLeft:'1%',
    backgroundColor:'#fafafa',
}
export default function HomeLayout({
                                     children,
                                   }: Readonly<{
  children: React.ReactNode;
}>) {
  return (
    <Flex style={{marginTop:64,width:'100%'}}>
      <div style={menuBarStyle}>
        <MenuBar nav={'/home/system'}/>
      </div>
      <Flex style={contentStyle} vertical justify={"space-between"}>
        <div>
          {children}
        </div>
        <FootBar />
      </Flex>
    </Flex>
  );
}
